<template>
    <div :class="`diy_header ${data.class.radius} ${data.class.tpl}`">
        <div
            class="diy_header_inner"
            :style="{'margin-bottom': data.style.margin_bottom+'px',
         'margin-left':data.style.margin_x+'px', 'margin-right': data.style.margin_x+'px',
         'background':data.style.background}"
        >
            <div  class="diy_header_left">
                <div class="diy_header_title" :style="{'color': data.style.title_color}">{{data.config.title}}</div>
                <div class="diy_header_sub_title" :style="{'color':data.style.sub_title_color}">{{data.config.sub_title}}</div>
            </div>
            <div class="diy_header_right">
                更多>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
const props = defineProps<{
    data: any
}>()
</script>

<style scoped lang="scss">
@use "src/views/site/diy/style.css";
</style>
